<!-- Horizontal Form -->
<div class="box box-info">
    <div class="box-header with-border">
        <h3 class="box-title">配置添加</h3>
        <h3 class="msg"></h3>
    </div>
    <!-- /.box-header -->
    <!-- form start -->
    <form class="form-horizontal">
        <div class="box-body">
            <div class="form-group">
                <label for="pdNameId" class="col-sm-2 control-label">配置名称</label>
                <div class="col-sm-8">
                    <input type="text" name="pdName" class="form-control" id="pdNameId"
                    placeholder="商品的配置名,不能为空" required=true>
                </div>
            </div>
            <div class="form-group">
                <label for="pdVersionId" class="col-sm-2 control-label">商品配置</label>
                <div class="col-sm-8">
                    <input type="text" name="pdVersion" class="form-control" id="pdVersionId"
                           placeholder="输入您商品的配置来区分商品,不能为空" required=true>
                </div>
            </div>
            <div class="form-group">
                <label for="colorId" class="col-sm-2 control-label">商品颜色</label>
                <div class="col-sm-8">
                    <input type="text" name="color" class="form-control" id="colorId"
                           placeholder="输入您商品的颜色来区分商品,不能为空">
                </div>
            </div>
            <div class="form-group">
                <label for="pdPriceId" class="col-sm-2 control-label">商品原价</label>
                <div class="col-sm-8">
                    <input type="number" name="pdPrice" class="form-control" id="pdPriceId"
                           placeholder="此配置的出售价格,不能为空">
                </div>
            </div>
            <div class="form-group">
                <label for="discountPriceId" class="col-sm-2 control-label">商品折扣价</label>
                <div class="col-sm-8">
                    <input type="number" name="discountPrice" class="form-control" id="discountPriceId"
                           placeholder="默认折扣价等于原价">
                </div>
            </div>
            <div class="form-group">
                <label for="residueNumId" class="col-sm-2 control-label">库存数量</label>
                <div class="col-sm-8">
                    <input type="number" name="residueNum" class="form-control" id="residueNumId"
                           placeholder="必须大于等于1">
                </div>
            </div>

        </div>
        <!-- /.box-body -->
        <div class="box-footer">
            <button type="button" class="btn btn-default btn-cancel">退出</button>
            <button type="button" class="btn btn-info pull-right btn-save">保存</button>
        </div>
        <!-- /.box-footer -->
    </form>

</div>
<script type="text/javascript" src="bower_components/ztree/jquery.ztree.all.min.js"></script>
<script type="text/javascript" src="bower_components/layer/layer.js"></script>
<script type="text/javascript">

    $(document).ready(function () {
        //页面加载完成以后加载角色信息并初始化页面
        doInitFormData();
        //事件注册
        $(".box-footer")
            //todo 检查返回时显示的是全部商品还是父类商品
            .on("click", ".btn-cancel", doCancel)   //触发取消
            .on("click", ".btn-save", doSaveOrUpdate);  //触发新增/修改
    });

    //取消
    function doCancel() {
        $("#mainContentId").removeData("rowData");
        $("#mainContentId").load("/modules/sys/kind_list.html");
    }

    //新增/修改
    function doSaveOrUpdate() {
        let rowData = $("#mainContentId").data("rowData"); //读取修改的数据
        //1.获取表单数据
        let data = doGetEditFormData();
        if (rowData) data.id = rowData.id; //如果有数据就是进行修改,id等于选中的id
        //用户输入校验
        if(data.pdName==""){
            alert("配置名称必须输入!");return;
        }
        if(data.pdVersion==""){
            alert("配置信息必须输入!");return;
        }
        if(data.color==""){
            alert("颜色信息必须输入!");return;
        }
        if(data.pdPrice==""){
            alert("商品没有价格做什么生意呀!");return;
        }
        if(data.pdPrice<data.discountPrice){
            alert("折扣价格必须小于或等于原价!");return;
        }
        if(data.discountPrice==""){
            data.discountPrice=data.pdPrice;
        }
        if(data.residueNum==""||data.residueNum==0){
            alert("库存数量必须大于等于1");return;
        }
        //2.发起异步请求
        let url = `${baseUrl}/shoppingback/ddKindType`;
        let method = rowData ? "put" : "post";  //如果有数据就是put,没数据就是post
        $.ajax({
            method: method,
            url: url,
            headers : {"Authorization": "Bearer " + window.localStorage.getItem("accessToken")},
            crossDomain: true,
            xhrFields: {withCredentials: true},
            data: JSON.stringify(data),
            contentType: "application/json",
            success(result) {
                if(result.status==401){
                    alert(result.msg);
                    return;
                }
                if(result.status==403){
                    alert(result.msg);
                    return;
                }
                if (result.success) {
                    alert(result.msg);
                    doCancel();
                } else {
                    alert(result.msg);
                }
            }
        })
    }

    //添加用户:读取输入的数据
    function doGetEditFormData() {
        //获取用户输入的数据
        let params = {
            pdName: $("#pdNameId").val(),
            pdVersion: $("#pdVersionId").val(),
            color: $("#colorId").val(),
            pdPrice: $("#pdPriceId").val(),
            discountPrice: $("#discountPriceId").val(),
            residueNum: $("#residueNumId").val(),
        }
        let pdId = $("#mainContentId").data("pdId");
        if (pdId) {
            params.pdId = pdId;
            params.soldNum = 0;
            params.saleState = 0;
        }
        return params;
    }

    //修改用户:读取表单数据
    function doInitFormData() {
        let data = $("#mainContentId").data("rowData");
        if (!data) return; //如果不是修改则返回
        //初始化配置信息
        $("#pdNameId").val(data.pdName);
        $("#pdVersionId").val(data.pdVersion);
        $("#colorId").val(data.color);
        $("#pdPriceId").val(data.pdPrice);
        $("#discountPriceId").val(data.discountPrice);
        $("#residueNumId").val(data.residueNum);
    }

</script>
    
    
    
    
    
    
    